<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- STYLESHEETS -->
    <!--[if lt IE 9]><script src="../../js/flot/excanvas.min.js"></script><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script><![endif]-->
    <link rel="stylesheet" type="text/css" href="../../css/cloud-admin.css">
    <link rel="stylesheet" type="text/css" href="../../css/themes/default.css" id="skin-switcher">
    <link rel="stylesheet" type="text/css" href="../../css/responsive.css">
    <link href="../../font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <!-- file-input -->
    <link rel="stylesheet" type="text/css" href="../../js/file-input/fileinput.css" />

    <!-- datatable -->
    <link rel="stylesheet" href="../../js/datatables/datatable.css">
    <link rel="stylesheet" type="text/css" href="../../js/select2/select2.min.css" />
    <style>
        .red {
            color: red;
            font-size: 12px;
            display: flex;
            align-items: center;
            height: 34px;
        }
    </style>
</head>

<body>
    <header class="navbar clearfix" id="header">
    </header>
    <!-- PAGE -->
    <section id="page">
        <!-- SIDEBAR -->
        <div id="sidebar" class="sidebar">
            <div class="sidebar-menu nav-collapse">

                <!-- SIDEBAR MENU -->
                <ul>

                </ul>
                <!-- /SIDEBAR MENU -->
            </div>

        </div>
        <!-- /SIDEBAR -->
        <div id="main-content">
            <!-- SAMPLE BOX CONFIGURATION MODAL FORM-->
            <div class="modal fade" id="box-config" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title">维护批发商</h4>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <label class="control-label col-md-3" style="line-height:34px;"><span class="required">*</span>批发商名称：</label>
                                <div class="col-md-4">
                                    <input type="text" class="form-control" name="supplierName" placeholder="请输入批发商名称" maxlength="20" />
                                    <input type="hidden" name="id" />
                                </div>
                                <div class="col-md-5 red">名称不能重复</div>
                            </div>
                            <div class="row">
                                <label class="control-label col-md-3" style="line-height:34px;"><span class="required">*</span>店铺编号：</label>
                                <div class="col-md-4">
                                    <input type="text" class="form-control" name="supplierId" placeholder="请输入店铺编号" maxlength="20" />

                                </div>
                                <div class="col-md-5 red">请到旺店通 设置->基础设置->店铺页面查看，保存后不可修改</div>
                            </div>
                            <div class="row" style="margin-bottom:10px">
                                <label class="control-label col-md-3" style="line-height:34px;"><span class="required">*</span>所属分类：</label>
                                <div class="col-md-4">
                                    <select id="type_select" name="typeSelect" class="col-md-12 select2-offscreen" tabindex="-1">
                                        <option></option>
                                        <option value='PaymentFirst'>先款后货</option>
                                        <option value='ShipmentFirst'>先货后款</option>
                                    </select>
                                </div>
                            </div>
                            <div class="row">
                                <label class="control-label col-md-3" style="line-height:34px;"><span class="required">*</span>结算周期：</label>
                                <div class="col-md-4">
                                    <input type="text" class="form-control" name="settlementTime" placeholder="请输入结算周期" maxlength="20" />

                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                            <button type="button" class="btn btn-success bt-save">保存</button>
                        </div>
                    </div>
                </div>
            </div>
            <!-- /SAMPLE BOX CONFIGURATION MODAL FORM-->
            <div class="container">
                <div class="row">
                    <div id="content" class="col-lg-12">
                        <!-- PAGE HEADER-->
                        <div class="row" style="height: 30px;">
                            <div class="col-sm-12">
                                <div class="page-header">
                                    <!-- STYLER -->

                                    <!-- /STYLER -->
                                    <!-- BREADCRUMBS -->
                                    <ul class="breadcrumb">
                                        <li>
                                            <i class="fa fa-home"></i>
                                            <a href="../index.html">首页</a>
                                        </li>
                                        <li>
                                            <a href="#">批发模式</a>
                                        </li>
                                        <li>预结列表</li>
                                    </ul>
                                    <!-- /BREADCRUMBS -->

                                </div>
                            </div>
                        </div>
                        <!-- /PAGE HEADER -->
                        <!-- FORMS QUERY-->
                        <!-- <div class="row">
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-md-12">
                                        提示：可选择预结算单号，提交给财务进行结算
                                    </div>
                                </div>
                            </div>
                        </div> -->

                        <div class="row">
                            <!-- TABLES -->
                            <div class="col-md-12">
                                <!-- BOX -->
                                <div class="box border primary">
                                    <div class="box-title">
                                        <h4><i class="fa fa-table"></i> 提示：可选择预结算单号，提交给财务进行结算 </h4>
                                    </div>
                                    <div class="box-body">
                                        <table id="db_brand_list" cellpadding="0" cellspacing="0" border="0" class="datatable table table-striped table-bordered table-hover">

                                        </table>
                                    </div>
                                </div>
                                <!-- /BOX -->
                            </div>
                        </div>
                        <div class='row' style='height: 20px;padding: 0 20px;'>
                            <div id="totalPerPriceBox" style='display: none;font-size: 18px;'>
                                应结金额合计：<span style='color: red;font-size: 20px;' id='totalPerPrice'>0</span>
                            </div>
                        </div>
                        <!-- /TABLES -->
                        <div class="row" style="text-align:center">
                            <button id='submitSettlement' class='btn btn-success btn-lg bt_edit '><i class='fa fa-pencil-square-o'></i>提交财务结算</button>
                        </div>
                        <div class="footer-tools">
                            <span class="go-top">
								<i class="fa fa-chevron-up"></i> Top
							</span>
                        </div>
                    </div>
                    <!-- /CONTENT-->
                </div>
            </div>
        </div>
    </section>

    <!--/PAGE -->
    <!-- JAVASCRIPTS -->
    <!-- Placed at the end of the document so the pages load faster -->
    <!-- JQUERY -->
    <script src="../../js/jquery/jquery-2.0.3.min.js"></script>
    <!-- JQUERY UI-->
    <script src="../../js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
    <!-- BOOTSTRAP -->
    <script src="../../bootstrap-dist/js/bootstrap.min.js"></script>

    <!-- BLOCK UI -->
    <script type="text/javascript" src="../../js/jQuery-BlockUI/jquery.blockUI.min.js"></script>

    <!-- AUTOSIZE -->
    <script type="text/javascript" src="../../js/autosize/jquery.autosize.min.js"></script>

    <!-- INPUT MASK -->
    <script type="text/javascript" src="../../js/bootstrap-inputmask/bootstrap-inputmask.min.js"></script>
    <!-- SELECT2 -->
    <script type="text/javascript" src="../../js/select2/select2.min.js"></script>

    <!-- bootstrap-fileupload -->
    <script type="text/javascript" src="../../js/jquery-upload/js/jquery.iframe-transport.js"></script>
    <script type="text/javascript" src="../../js/jquery-upload/js/jquery.fileupload.min.js"></script>
    <script type="text/javascript" src="../../js/jquery-upload/js/jquery.fileupload-process.min.js"></script>
    <script type="text/javascript" src="../../js/jquery-upload/js/jquery.fileupload-validate.min.js"></script>

    <!-- UNIFORM -->
    <script type="text/javascript" src="../../js/uniform/jquery.uniform.min.js"></script>
    <!-- spinner -->
    <script src="../../js/spinner/spin.js"></script>
    <!-- DATA TABLES -->
    <script type="text/javascript" src="../../js/datatables/bootstrap-select.js"></script>
    <script type="text/javascript" src="../../js/datatables/datatable.js"></script>
    <script type="text/javascript" src="../../js/datatables/datatable-bootstrap.js"></script>
    <script type="text/javascript" src="../../js/datatables/datatable-tabletools.js"></script>
    <script type="text/javascript" src="../../js/datatables/fnAddTr.js"></script>

    <!--bootbox-->
    <script type="text/javascript" src="../../js/bootbox/bootbox.min.js"></script>
    <!-- COOKIE -->
    <script type="text/javascript" src="../../js/jQuery-Cookie/jquery.cookie.min.js"></script>
    <!-- CUSTOM SCRIPT -->
    <script src="../../js/script.js"></script>
    <script src="../../js/common.js"></script>
    <script>
        console.log($.erp.getUrlParms(window.location.href));
        var wholesalerId = $.erp.getUrlParms(window.location.href).id
        var Brand = function() {
            //保存编辑
            var saveSupplier = function() {

                $(".form-group").removeClass("has-error");
                var wholesalerName = $("input[name=supplierName]").val();
                var shopNo = $("input[name=supplierId]").val();
                var billingType = $('#type_select').val();
                var billingCycle = $("input[name=settlementTime]").val();
                console.log(billingCycle);

                if (wholesalerName == "") {
                    $("input[name=supplierName]").parents(".row").addClass("has-error");
                    return false;
                }
                if (shopNo == "") {
                    $("input[name=supplierId]").parents(".row").addClass("has-error");
                    return false;
                }
                if (billingType == "") {
                    $('#type_select').parents(".row").addClass("has-error");
                    return false;
                }
                if (billingCycle == "") {
                    $("input[name=settlementTime]").parents(".row").addClass("has-error");
                    return false;
                }

                var supplier = {};
                supplier.id = $("input[name=id]").val();
                supplier.wholesalerName = wholesalerName;
                supplier.shopNo = shopNo;
                supplier.billingType = billingType;
                supplier.billingCycle = billingCycle
                    // return
                $.ajax({
                    type: "post",
                    url: App.getContextPath() + "admin/wholesaler/edit.do",
                    async: true,
                    data: supplier,
                    success: function(result) {
                        if (result.type === 'error') {
                            $.alert(result.content)
                            return
                        }
                        $("#box-config").modal("hide");
                        $.clearInput();
                        searchPreSettlement();
                    }
                });


            };

            var searchPreSettlement = function() {
                var url = App.getContextPath() + "admin/wholesaler/findPrebillRecordList.do?wholesalerId=" + wholesalerId
                var dtSetting = $.dataTableSetting({
                    "ajaxSource": url,
                    "serverSide": false,
                    "bFilter": false, // 去掉搜索框
                    "bLengthChange": false, // 每页显示数量
                    "sScrollX": "100%",
                    "sScrollXInner": "100%",
                    "iDisplayLength": -1,
                    "bSort": false,
                    paging: false,
                    "aoColumns": [{
                        "sClass": "text-center",
                        "data": "ID",
                        "render": function(data, type, row) {
                            return '<input type="checkbox"  class="checkchild" data-price="' + row.prebillPrice + '" value="' + row.prebillCode + '" />';
                        },
                        "title": '<div style="display:flex;align-items:center"><input type="checkbox" id="checkall" class="checkall" /><label for="checkall" style="margin-bottom:0">全选</label></div> ',
                        width: "5%"
                            // "bSortable": false
                    }, {
                        "mDataProp": "prebillCode",
                        "sTitle": "预结算单号",
                        "width": "10%"
                    }, {
                        // "mDataProp": "prebillPrice",
                        "sTitle": "预结金额",
                        "width": "10%",
                        "render": function(data, type, row) {
                            return format_thousands(row.prebillPrice);
                        }
                    }, {
                        "mDataProp": "recordTypeDesc",
                        "sTitle": "类型",
                        "width": "10%"
                    }, {
                        "sTitle": "时间段 ",
                        "width": "8%",
                        render: function(data, type, row) {
                            return $.getLocalDate(row.startDate) + '到' + $.getLocalDate(row.endDate)
                        }
                    }, {
                        "mDataProp": "remark",
                        "sTitle": "备注 ",
                        "width": "8%"
                    }, {
                        "sTitle": "操作",

                        "render": function(data, type, row) {
                            var str = "<p class='btn-toolbar' style='margin:0px'>" +
                                "<form role='form' action='../../admin/wholesaleprebill/exportRecordDetail.do'><button name='prebillCode' value='" + row.prebillCode + "' class='btn btn-danger btn-xs bt_export btn-width'><i class='fa fa-download'></i> 导出</button></form>" + "</p>";
                            if (row.recordType === 'ReturnOrder' || row.recordType === 'Order') {

                                return str;
                            } else {
                                return
                            }
                        },
                        "width": "7%"
                    }]
                });

                $mainDataTable = $("#db_brand_list").dataTable(dtSetting);
            };



            function exportDetail() {
                $(this).closest("form").submit();
                // $("#recharge-config").find("input[name=wholesalerId]").val($(tr).find("td:eq(0)").html());
                // if ($(tr).find(".productNum").html() != "0") {
                //     $.alert("批发商下已经绑定商品，请先解除关系后，再删除！");
                //     return;
                // } else {

                // }
            };

            function submitSettlement() {
                let checkedList = $('input:not("#checkall"):checkbox:checked')
                if (checkedList.length <= 0) { // 没有选中商品
                    $.alert('请选中至少一条')
                    return
                }


                $.confirm("确认提交结算，操作不可恢复!", function() {
                    let prebillCodes = Array.from(checkedList).map(item => item.value).toString()
                    $.ajax({
                        type: "post",
                        url: App.getContextPath() + "admin/wholesaler/commitPrebillRecord.do",
                        async: true,
                        data: {
                            prebillCodes
                        },
                        success: function(result) {
                            if (result.type === 'error') {
                                $.alert(result.content)
                                return
                            }
                            $('#totalPerPriceBox').hide()
                            $.alert('提交成功')
                            searchPreSettlement();
                        }
                    });
                });


            };
            return {

                init: function() {
                    searchPreSettlement();
                    $(".search").click(searchPreSettlement);
                    $("#submitSettlement").click(submitSettlement)
                    $("#db_brand_list").on("click", ".bt_export", exportDetail);
                    $('.dataTables_scroll').on("change", "input[type='checkbox']", function() {
                        let checkedList = $('input:not("#checkall"):checkbox:checked')
                        if (checkedList.length > 0) { // 显示总价
                            $('#totalPerPriceBox').show()
                        } else {
                            $('#totalPerPriceBox').hide()
                        }

                        let totalPerPrice = Array.from(checkedList).reduce((pre, cur) => {
                            // console.dir($(item).attr("data-price"))
                            return pre + parseFloat($(cur).attr("data-price"))
                        }, 0);
                        $('#totalPerPrice').html(totalPerPrice.toFixed(2))
                        let prebillCodes = Array.from(checkedList).map(item => item.value).toString()
                    })
                }
            }
        }();


        $(function() {
            $("#header").load("../head.html");
            App.init(); //Initialise plugins and elements
            Brand.init();

        });
    </script>
    <!-- /JAVASCRIPTS -->
</body>

</html>